<template>
  <div id="box">
    <!-- <Teleport> 是一个内置组件，它可以将一个组件内部的一部分模板“传送”到该组件的 DOM 结构外层的位置去。 -->
    <Teleport to="body">
        <div id="cover">
            <h1>显示的位置都不变，dom的移动</h1>
        </div>
    </Teleport>
       <Suspense>
          <!-- 加载异步内容 可以直接解析 -->
          <h1>{{p}}</h1>
       </Suspense>
  </div>
</template>

<script setup>
  import axios from 'axios'
  let p=Promise.resolve("你好")
</script>
<style>
    #cover{
      width:100vw;
      height:300px;
      background:rgba(0,0,0,0.5);
    }
</style>